// pages/feedback/index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    tabs: [{
        id: 0,
        name: '体验问题',
        isActive: true
      },
      {
        id: 1,
        name: '商品、商家投诉',
        isActive: false
      }
    ],
    // 被选中的图片路径 数组
    chooseImgs: [],
    // 文本域的内容
    textVal: ""

  },
  // 外网的图片的路径数组
  UpLoadImgs: [],
  //tab栏的切换
  changeTab(e) {
    console.log(e)
    const {
      index
    } = e.detail
    //深拷贝tabs
    let tabs = JSON.parse(JSON.stringify(this.data.tabs))
    //遍历数组
    tabs.forEach((item, i) => i === index ? item.isActive = true : item.isActive = false)
    this.setData({
      tabs
    })
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },
  // 点击 “+” 选择图片
  handleChooseImg() {
    // 2 调用小程序内置的选择图片api
    wx.chooseImage({
      // 同时选中的图片的数量
      count: 9,
      // 图片的格式  原图  压缩
      sizeType: ['original', 'compressed'],
      // 图片的来源  相册  照相机
      sourceType: ['album', 'camera'],
      success: (result) => {

        this.setData({
          // 图片数组 进行拼接 
          chooseImgs: [...this.data.chooseImgs, ...result.tempFilePaths]
        })
      }
    });

  },
  //点击小叉号删除图片
  removeImage(e) {
    const {
      src
    } = e.detail
    //获取data中的图片数组
    const {
      chooseImgs
    } = this.data
    const index = chooseImgs.findIndex(v => v === src)
    if (index !== -1) {
      chooseImgs.splice(index, 1)
    }
    this.setData({
      chooseImgs
    })
  },
  //点击图片预览图片
  previewImg(e) {
    //获取要预览图片的路径
    const current = e.currentTarget.dataset.url
    //先构造要预览的图片数组
    let urls = this.data.chooseImgs
    wx.previewImage({
      current,
      urls
    });
  },
  // 文本域的输入的事件
  handleTextInput(e) {
    this.setData({
      textVal: e.detail.value
    })
  },
  // 提交按钮的点击
  handleFormSubmit() {
    // 1 获取文本域的内容 图片数组
    const {
      textVal,
      chooseImgs
    } = this.data;
    // 2 合法性的验证
    if (!textVal.trim()) {
      // 不合法
      wx.showToast({
        title: '输入不合法',
        icon: 'none',
        mask: true
      });
      return;
    }
    // 3 准备上传图片 到专门的图片服务器 
    // 上传文件的 api 不支持 多个文件同时上传  遍历数组 挨个上传 
    // 显示正在等待的图片
    wx.showLoading({
      title: "正在上传中",
      mask: true
    });

    // 判断有没有需要上传的图片数组

    if (chooseImgs.length != 0) {
      chooseImgs.forEach((v, i) => {
        wx.uploadFile({
          //图片要上传到哪里
          url: 'https://images.ac.cn/Home/Index/UploadAction/',
          //被上传的文件的路径
          filePath: v,
          //上传文件的名称，后台来获取文件 file
          name: "file",
          //顺带的文本信息
          formData: {},
          success: (result) => {
            console.log(result)
          }
        });
        setTimeout(() => {
          wx.showToast({
            title: '(×_×)链接已丢失!请联系工作人员',
            icon: 'none',
            image: '',
            duration: 1500,
            mask: false,
          });
        }, 1500)
        setTimeout(() => {
          wx.hideLoading();
          wx.navigateBack({
            delta: 1
          });
        }, 3500)
      })
    } else {
      setTimeout(() => {
        wx.showToast({
          title: '提交成功',
          icon: 'success',
          duration: 1500,
          mask: false,
        });
      }, 1500)
      setTimeout(() => {
        wx.hideLoading();
        wx.navigateBack({
          delta: 1
        });
      }, 2500)

    }
  },

})